<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>超市进销存管理系统</title>
<style type="text/css">
.login-page {
	width: 360px;
	padding: 8% 0 0;
	margin: auto;
}

.form {
	position: relative;
	z-index: 1;
	background: #FFFFFF;
	max-width: 360px;
	margin: 0 auto 100px;
	padding: 45px;
	text-align: center;
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0
		rgba(0, 0, 0, 0.24);
}

.form input {
	font-family: "Roboto", sans-serif;
	outline: 0;
	background: #f2f2f2;
	width: 100%;
	border: 0;
	margin: 0 0 15px;
	padding: 15px;
	box-sizing: border-box;
	font-size: 14px;
}

.form .button {
	font-family: "Microsoft YaHei", "Roboto", sans-serif;
	text-transform: uppercase;
	outline: 0;
	background: #4CAF50;
	width: 240px;
	display:block;
	border: 0;
	padding: 15px;
	color: #FFFFFF;
	font-size: 14px;
	-webkit-transition: all 0.3 ease;
	transition: all 0.3 ease;
	cursor: pointer;
}

.form .button:hover, .form .button:active, .form .button:focus {
	background: #43A047;
}

.form .message {
	margin: 15px 0 0;
	color: #b3b3b3;
	font-size: 12px;
}

.form .message a {
	color: #4CAF50;
	text-decoration: none;
}

.form .register-form {
	display: none;
}
.center{
	text-align: center;
	font-size: 24px;
}
.container {
	position: relative;
	z-index: 1;
	max-width: 300px;
	margin: 0 auto;
}

.container:before, .container:after {
	content: "";
	display: block;
	clear: both;
}

.container .info {
	margin: 50px auto;
	text-align: center;
}

.container .info h1 {
	margin: 0 0 15px;
	padding: 0;
	font-size: 36px;
	font-weight: 300;
	color: #1a1a1a;
}

.container .info span {
	color: #4d4d4d;
	font-size: 12px;
}

.container .info span a {
	color: #000000;
	text-decoration: none;
}

.container .info span .fa {
	color: #EF3B3A;
}

body {
	background: #76b852; /* fallback for old browsers */
	background: -webkit-linear-gradient(right, #76b852, #8DC26F);
	background: -moz-linear-gradient(right, #76b852, #8DC26F);
	background: -o-linear-gradient(right, #76b852, #8DC26F);
	background: linear-gradient(to left, #76b852, #8DC26F);
	font-family: "Roboto", sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
p.center {
	color: #fff;
	font-family: "Microsoft YaHei";
}
p.loginType{
	display: flex;
	flex-direction: row;
}
p.loginType label{
	display: flex;
	flex-direction: row;
	width: 50%;
	line-height: 24px;
}
p.loginType label>input{
	width: 20px;
	height: 20px;
}
</style>
</head>
<body>
	<div id="wrapper" class="login-page">
		<p class="center">超市进销存管理系统</p> 
		<div id="login_form" class="form">
			<form class="login-form" method="post" id="loginForm" name="loginForm">
				<input type="text" placeholder="用户名" value="" id="loginname" name="loginname" />
				<input type="password" placeholder="密码" id="password" name="password"/>
				<p class="loginType">
					<label for="loginTypeB"><input type="radio" name="loginType" value="B" id="loginTypeB" checked="checked">普通员工</label>
					<label for="loginTypeA"><input type="radio" name="loginType" value="A" id="loginTypeA">管理员</label>
				</p>
				<a class="button" id="login">登 录</a>
			</form>
		</div>
	</div>
	<script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/jquery.min.js"></script>
	<script type="text/javascript">
	function severCheck(){			
		var loginname = $("#loginname").val();
		var password = $("#password").val();
		if(!loginname||loginname.trim()==""){
			alert("请输入用户名");
			return false;
		}
		if(!password||password.trim()==""){
			alert("请输入密码");
			return false;
		}
		if($("#loginTypeA").prop("checked")){
			$("#loginForm").attr("action","${pageContext.request.contextPath}/manager/dologin");
			loginForm.submit();
		}else{
			$("#loginForm").attr("action","${pageContext.request.contextPath}/staff/dologin");
			loginForm.submit();
		}
	}
		$(function() {
			$("#login").click(function() {
				severCheck();
				return false;
			})
		})
	</script>
</body>
</html>